html,body{
    margin: 0;
    padding: 0;
    font-size: 16px;
}

.box {
    width: 100vw;
    height: 100vh;
    background-image: url(../../assets/images/pageBg.png);
    color: white;
    
    /* display: flex; */

        /* box-sizing: border-box; */
}

header {
    width: 100vw;
    height: 8vh;
    background: url(../../assets/images/Top.png) no-repeat 0 0 / 100% 100%;
    position: absolute;
    left: 0;
    top: 0;
    z-index: 1;
}

main {
    width: 100vw;
    height: 100vh;
    display: flex;
    position: relative;
    left: 0;
    top: 0;
}

.left {
    width: 30%;
    height: 100vh;
    background: url(../../assets/images/Left.png) no-repeat 0 0 / 100% 100%;
    position: absolute;
    left: 0;
    top: 0;
    font-size: 12px;
}
.ltop{
margin: 70px 50px 30px 50px;
/* border: 1px solid red; */
height: 40vh;
color: white;
margin-bottom: 10px;
}
.ltit{
    width: 100%;
    height: 30px;
    background: url(../../assets/images/titlebg.png) no-repeat 0 0/100% 100%;
    /* box-sizing: border-box; */
    padding-left: 10px;
    line-height: 30px;
      box-sizing: border-box;
}
.lbox{
    width: 100%;
    height: 90%;
    /* background-color: plum; */
    margin: auto;
    background-color: #0c1d5f;
}
.tu{
    width: 80%;
    height: 35px;
  display: flex;
  margin: auto;
  justify-content: space-around;
  align-items: center;
  margin-top: 10px;
}
.tt{
    margin-top: 10px;
     width: 80%;
     height: 40%;
     margin: auto;
     margin-top: 10px;
     /* background-color: plum; */
     border: 1px solid #081673;
      background-color: #172e6e;
}
.tt p{
    margin-left: 10px;
    width: 80%;
    border-bottom: 1px solid #3042a9;
    
}

.qin{
     margin-top: 10px;
     width: 80%;
     height: 35%;
     margin: auto;
     margin-top: 10px;
     /* background-color: plum; */
     border: 1px solid #3042a9;
     display: flex;
     justify-content: space-around;
      background-color: #172e6e;
}
.la{
    width: 45%;
    height: 100%;
    border-right: 1px solid #3042a9;
}
.laa{
    width: 100%;
    display: flex;
    justify-content: space-around;
}
.lab{
    width: 100%;
    display: flex;
    justify-content: space-around;
    align-items: center;
}
.lb{
    width: 45%;
    height: 100%;
}
.hh{
    width: 20px;
    height: 10px;
    background-color: #07a93c;
    border-radius: 20px 20px;
}

.lbot{
margin: 40px 50px 30px 50px;
/* border: 1px solid red; */
height: 40vh;

}
.lba{
    background-color: #0c1d5f;
    margin-top: 20px;
    width: 100%;
    height: 90%;
}
.lxue{
    width: 100%;
    height: 100%;
}

.aa1{
    background-color: greenyellow;
    display: inline-block;
    width: 3px;
    height: 7px;
}

.center {
    width: 40%;
    height: 100%;
    /* flex: 1; */
    color: #fff;
    /* background-color: plum; */

  
    /* border: 1px solid red; */
}
.ctop{
    width: 40%;
    height:65%;
    position: absolute;
    margin-left: 30%;
    margin-top: 3%;
    
    /* flex: 1; */
   /* border: 1px solid red; */
}
.cnav{
    /* border: 1px solid red; */
     position: absolute;
     bottom: 0;
     left: 27%;
     width: 45%;
     height: 130px;
}

.right {
     width: 30%;
    height: 100vh;
    background: url(../../assets/images/Right.png) no-repeat 0 0 / 100% 100%; 
    position: absolute;
    right: 0;
    top: 0;
}
.rtop{
margin: 70px 50px 30px 50px;
/* border: 1px solid red; */
height: 40vh;
color: white;
}
.rbot{
margin: 30px 50px 30px 50px;
/* border: 1px solid red; */
height: 40vh;

}

